import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
//引入path模块
import { resolve } from "path"
import tailwindcss from '@tailwindcss/vite';
import { viteMockServe } from 'vite-plugin-mock'
export default defineConfig({
  base: "/",
  plugins: [
    vue(),
    // tailwindcss(),
    // mock 数据的 dev环境
    viteMockServe({
      // supportTs: true, // 是否开启支持ts
      // enable: command === 'serve', // 只有开发环境才开启mock, 根据命令类型（command）和 vite 的模式（mode）决定是否启用 mock 服务
      mockPath: 'mock', // 存放mock文件的目录，默认是'mock'
      localEnabled: true, // 设置是否监视mockPath对应的文件夹内文件中的更改
      prodEnabled: false, // 设置是否启用生产环境的mock服务
      watchFiles: true, // 是否监视文件更改
      logger: true  //是否在控制台显示请求日志
    }),
  ], //注册插件
  server: {
    https: false, // 是否开启 https
    open: true, // 是否自动在浏览器打开
    port: 3000, // 端口号
    hmr: true, //开启热更新
    host: "0.0.0.0",
    //允许跨域
    cors: true,
    proxy: {
      "/api": {
        target: `http://127.0.0.1`, // 后台接口
        changeOrigin: true,
        // secure: false, // 如果是https接口，需要配置这个参数
        // ws: true, //websocket支持
        // rewrite: (path) => path.replace(/^\/api/, ""),
      },
    },
  },

  resolve: {
    //通过配置alias来定义路径的别名
    alias: {
      '@': resolve(__dirname, "src"),
      '~': resolve(__dirname, "src")
    },
  },

  build: {
    outDir: "dist", // 指定输出路径
    assetsDir: "assets", // 指定生成静态资源的存放路径
    minify: "terser", // 混淆器,terser构建后文件体积更小
    sourcemap: false, //是否构建source map 文件
    terserOptions: {
      compress: {
        drop_console: true, // 生产环境移除console
        drop_debugger: true, // 生产环境移除debugger
      },
    },
  },
});
